import React from 'react';
import msg from '../../assets/消息.png';
import { Cell } from 'react-vant';
import { NavBar, Tag } from 'antd-mobile';
import { useNavigate } from 'react-router-dom'
import styles from './index.module.css'
const Index: React.FC = () => {
    const navigate = useNavigate()
    return (
        <div className={styles.bo}>
            <NavBar backIcon={false} style={{ backgroundColor: '#fff' }}>医生消息</NavBar>
            <Cell className={styles.msg} label="近期热门推荐" onClick={() => navigate('/xitong')} icon={
                <img style={{width:'35px',height:'35px'}} src={msg}  />
            }>
                {/* 修改title属性，将系统消息和置顶标签放在一个容器中 */}
                <div style={{ display: 'flex', alignItems: 'center' }}>
                    <span style={{ marginRight: '10px' }}>系统消息</span>
                    <Tag fill='outline' style={{ '--background-color': '#1890ff', color: '#fff', border: 'none',marginLeft: '1%' }}>
                        置顶
                    </Tag>
                </div>
                {/* 移除原来在这里的Tag组件 */}
                <span style={{ color: '#999' }}>近期热门推荐</span>
                <div style={{ color: '#999', position: 'absolute', right: '0', top: '10px' }}>昨天</div>
            </Cell>
        </div>
    );
};

export default Index;